import React, { PureComponent } from "react";
import { connect } from "react-redux";
import Home from "components/Home";

import {fetchHome,homeFlag} from 'actions/home';

import PropTypes from 'prop-types';
import TweenOne from 'rc-tween-one';
@connect((state) => ({
  home: state.home,
  login: state.login
}), {
  fetchHome,homeFlag
})
export default class extends PureComponent {
  state = {
    carouselList:[],
    notice:[],
    flag:true
  };
  static propTypes = {
    children: PropTypes.any,
    className: PropTypes.string,
    paused: PropTypes.bool,
  }
animation = { rotate: -30, repeat: -1, duration: 1000 };
  

  componentDidMount() {
    
    let that = this
    
  let {fetchHome,homeFlag} = this.props
  fetchHome()
    
  setTimeout(()=>{
    that.setState({
      flag:false
    })
  },2000)
  }
  componentWillUnmount(){
  }
  render() {
    const { home } = this.props;
    // console.log(home.homeData.publicBannerList)
    //  const {carouselList} = this.state;
    let {flag} = this.state
    let {isLogin} = this.props.login
    let username = ''
    let str 
    if(localStorage.getItem('userData')!=undefined&&localStorage.getItem('userData')!="undefined"&&localStorage.getItem('userData')!=null){
       username=JSON.parse(localStorage.getItem('userData')).nickName
       
 
    }
    if(JSON.stringify(home.homeData)!='{}'){
      if(home.homeData.publicBannerList.length>0){
        str =  <Home 
        carouselList={home.homeData.publicBannerList}
        notice={home.homeData.notice}
        username={username}
        homeLoan={home.homeData.homeLoan}
        activeBannerList={home.homeData.activeBannerList}
        isLogin={isLogin}/>
       }else{
         str=null
       }
     }
     
   let animation  =  { rotate: 360, repeat: -1, duration: 1000 }
   
    return (
      <div>
       {/* {flag?<TweenOne
          animation={this.animation}
          paused={this.props.paused}
          className="code-box-shape"
          style={{zIndex:10000,position:'fixed',width:100,height:100,backgroundColor:'red'}}
        />:null}  */}
       {str}
      </div>
    );
  }
}
